<template>
  <div>
    <nav-bar title="工作"></nav-bar>
    <div class="home maxinBox" v-if="user.userType === '04'">
      <div class="backgroundfff" style="margin: 0 auto;height: 47vh;padding: 6.25rem 0;">
        <div class="center">
          <img src="../../assets/images/null.png" alt="">
        </div>
      </div>
    </div>
    <div class="home maxinBox" v-else-if="user.userType === '02' && user.userStatus === '1'">
      <div class="backgroundfff" style="margin: 0 auto;height: 47vh;padding: 6.25rem 0;">
        <div class="center">
          <img src="../../assets/images/null.png" alt="">
          <p>您的入场申请已提交，请耐心等待审核通过...</p>
        </div>
      </div>
    </div>
    <div class="home maxinBox" v-else-if="user.userType === '02' && user.userStatus === '3'">
      <div class="backgroundfff" style="margin: 0 auto;height: 47vh;padding: 6.25rem 0;">
        <div class="center">
          <img src="../../assets/images/null.png" alt="">
          <p>{{localStorage.getItem('exitReason')}}</p>
        </div>
      </div>
    </div>
    <div class="work maxinBox" v-else>
      <div class="backgroundfff" style="padding: 0.9375rem;">
        <div class="titleModel">
           <p>项目管理</p>
          <van-row>
            <work-piece v-for="(item, index) in safetyList" :key="index" :data="item"></work-piece>
          </van-row>
        </div>
        <div class="titleModel">
          <p>考勤管理</p>
          <van-row>
            <work-piece v-for="(item, index) in attendanceList" :key="index" :data="item"></work-piece>
          </van-row>
        </div>
        <div class="titleModel">
          <p>人员车辆</p>
          <van-row>
            <work-piece v-for="(item, index) in personList" :key="index" :data="item"></work-piece>
          </van-row>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
  import WorkPiece from '../../components/WorkPiece.vue'
  import myAPI from '../../api/myAPI.js'
  export default {
    components: {
      WorkPiece
    },
    data() {
      return {
        personList: [],
        safetyList: [],
        attendanceList: [],
        user: {
          userStatus: '',
          userType: '',
        }
      }
    },
    methods:{
      // 查询所有模块
      getUerModel() {
        myAPI.getFunction().then(res => {
          // res.result.push(
          // {
          //   name: '生活费管理',
          //   type: '考勤管理',
          //   name1: 'costLiveManage',
          //   name2: 'costLiveManageSquare',
          //   router: 'CostLiveManage'
          // },
          // {
          //   name: '材料管理',
          //   type: '项目管理',
          //   // name1: 'materialManage',
          //   // name2: 'materialManageSquare',
          //   name1: 'costLiveManage',
          //   name2: 'costLiveManageSquare',
          //   router: 'MaterialManage'
          // })

          this.safetyList = res.result.map(item => {
            if (item.type === '项目管理') {
              return item
            }
          }).filter(Boolean)
          this.personList = res.result.map(item => {
            if (item.type === '人员车辆') {
              return item
            }
          }).filter(Boolean)
          this.attendanceList = res.result.map(item => {
            if (item.type === '考勤管理') {
              return item
            }
          }).filter(Boolean)
        })
      },
    },
    mounted() {
      this.user.userStatus = localStorage.getItem('userStatus')
      this.user.userType = localStorage.getItem('userType')
      this.getUerModel()
    }
  }
</script>

<style scoped lang="scss">
  .titleModel{
    p{
      margin: 0.3125rem;
      font-weight: bold;
    }
    border-bottom: 0.0625rem solid #E5E5E5;
  }
</style>
